import React, { Component } from 'react';
import { Button, FormControl } from 'tinper-bee';
import './index.less';

export default class CommonHeader extends Component {
	constructor (props){
		super(props);
		this.state ={
			title: this.props.title || '',
			baseData: this.props.headerBtnGroupHander || [],
			text: ''
		}
	}
	handlerChange=(e)=>{
		let text = e.target.value;
		let onSearchChange = this.props.onSearchChange;
		if(onSearchChange){
			onSearchChange(text)
		}
		this.setState({
			text: text
		});
	}
	getSearch =() =>{
		let getSearch = this.props.getSearch;
		if(getSearch){
			getSearch()
		}
	}
	render (){
		let { title, baseData } = this.state;
		return (
			<div className="common__header clearfix">
				<h1 className="common__header-title">{title}</h1>
				{
					this.props.isInput ? (
						<div className="common__header-input">
							<FormControl value={this.state.text} onChange={this.handlerChange}
							placeholder={this.props.Inplaceholder} />
							<Button onClick={this.getSearch}>搜索</Button>
						</div>
					) : ''
				}
				<div className="common__btn-group">
					{
						this.state.baseData.map((item)=>{
							return <Button colors="primary" onClick={item.handler}
							className={item.class}>{item.name}</Button>
						})
					}
				</div>
			</div>
			)
	}
}